<template>
	<view>
		<view class="message-message" @clickto="clickto">
			
			<view class="message-right" v-if="obj.types==0"> 
				<view class="right-discount">
					<view class="time">今天{{Time}}</view>
					<view class="discount">{{obj.value}}</view> 
				</view>
				<view class="">
					<img src="@/static/imges/12.png" alt="" srcset="" class="img">
				</view>
			</view>
			
			<view class="message-left" v-else-if="obj.types==1">
				<view class="">
					<img src="@/static/imges/12.png" alt="" srcset="" class="img">
				</view>
				<view class="left-text"> 
					<view class="">
						<view class="" v-for="(item,index) in arrlist" :key="item" @click="clickorther(item)">
						{{arrlist.length==1?"":index+1}}.{{item}} 
						</view> 
					</view>
				</view>  
			</view>
		</view>
		 
	</view>
</template>

<script> 
	export default {
		name:"message",
		props:{
			types:{
				type:Number,
				default:0
				},
			value:{
				type:String,
				default:""
			},
			obj:{
				type:Object,
				default:{types:0,value:""}
			}
		},
		data() {
			return {
				Time:"",
				arrlist:[]
			
			};
		},
		created() { 
			let time=new Date();
			this.Time=(time.getHours()<10?"0"+time.getHours():time.getHours())
			+":"+
			(time.getMinutes()<10?"0"+time.getMinutes():time.getMinutes())
			+":"+
			(time.getSeconds()<10?"0"+time.getSeconds():time.getSeconds())
			// console.log(63,time);
			if(this.obj.types==1){
				let newStr=this.obj.value.replace(/\'/g,'"')
				this.arrlist=JSON.parse(newStr)
				// console.log(62,this.arrlist);
			}
			
		},
		methods:{
			 clickto(question){ 
					console.log(46,question);
			},
			 clickorther(question){
				
				if(this.arrlist.length==1) return
				// console.log(72,question);
				this.$emit("clickes",question) 
			}
		}
	}
</script>

<style lang="scss">
.message-message{
	margin-top: 50px;
	.message-right{
		display: flex;
		justify-content: flex-end;
		flex-direction: row;
		align-items: center;
		.right-discount{ 
			margin-right: 5px;
			.discount{
				padding: 5px; 
				background-color:#d95f2e ;
				border-radius: 10px;
			}
			.time{
				font-size: 12px;
			}
		}
	}
	.message-left{ 
		display: flex;
		.left-text{
			margin-left: 5px;
			padding: 5px; 
			background-color:#d95f2e ;
			border-radius: 10px;
		}
	}
}
.img{
	width: 50px;
	height: 50px;
	border-radius: 50%;
} 
</style>